<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>外边框跑马灯</title>
    <link rel="stylesheet" href="css/Marquee.css" type="text/css">
    <script src="../statics/common/js/jquery.min.js" type="text/javascript"></script>
    <script src="js/Marquee.js" type="text/javascript"></script>
</head>
<body>
<button id="cycle" onclick="alternate_methode()">逆向</button>
<div id="marquee">
    <div id="img"></div>
</div>


<script>
    let isAlterNate = false;

    function alternate_methode() {
        if (!isAlterNate) {
            isAlterNate = true;
            $('body').append("<style>#marquee:before,#marquee:after{animation-direction:alternate} </style>")
        }
    }
</script>
</body>
</html>